{% load compile_static %}
{% load static %}
<!doctype html>
<html>
<head>
    <title>TableFetch Kitchen{% block title %}{% endblock %}</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <link href="{% static 'bootstrap/dist/css/bootstrap.min.css' %}" rel="stylesheet" type="text/css" />

    <link href="//fonts.googleapis.com/css?family=Lobster&subset=latin,latin-ext" rel='stylesheet' type='text/css'>
    <link href="{% static 'common.scss'|compile %}" rel="stylesheet" type="text/css" />
    {% block cssincludes %}
    {% endblock %}
</head>
<body>
    <div class="container-fluid">
        <div class="row">
            <nav class="sidebar col-md-2 col-sm-3 p-0">
                <ul class="nav nav-pills flex-column dashboard-menu">
                    <li class="nav-item">
                        <a class="nav-link {% if side_active == "map" %}active{% endif %}" href="{% url 'map' %}">Map</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link {% if side_active == "orders" %}active{% endif %}" href="{% url 'orders' %}">Orders</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link {% if side_active == "menu" %}active{% endif %}" href="{% url 'menu' %}">Menu</a>
                    </li>
                </ul>
                <ul class="nav flex-column dashboard-menu">
                    <li>
                        <a class="nav-link {% if side_active == "settings" %}active{% endif %}" href="">Settings</a>
                    </li>
                    <li>
                        <a class="nav-link" href="{% url "logout" %}">Logout</a>
                    </li>
                </ul>
            </nav>
            <div class="dashboard-body col-md-10 offset-md-2 col-sm-9 p-3">
                {% block content %}
                {% endblock %}
            </div>
        </div>
    </div>

    <div style="display: none;" id="templates">
        {% block templates %}{% endblock %}
    </div>

    <script src="{% static 'jquery/dist/jquery.min.js' %}"></script>
    <script src="{% static 'tether/dist/js/tether.min.js' %}"></script>
    <script src="{% static 'bootstrap/dist/js/bootstrap.min.js' %}"></script>
    <script src="{% static 'js-cookie/src/js.cookie.js' %}"></script>
    <script src="{% static 'js/common.js' %}"></script>

    {% block scripts %}{% endblock %}
</body>
</html>
